<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>07_猜数字练习</title>
</head>
<body>
<h4>猜数字游戏</h4>
<input type="text" placeholder="请输入要猜的数字" id="a">
<button onclick="guess()">确定</button>
<h4>结果：<span></span></h4>
<script>
    //生成一个用来猜的随机数
    let num=parseInt(Math.random()*100)+1;
    console.log(num)
    //获取用户输入的数字
    let a=document.getElementById('a').value;
    //获取结果的span标签
    let spanE=document.querySelector('span');
    //定义变量统计次数
    var count=0;
    function guess(){
        //获取用户输入的数字
        let a=document.getElementById('a').value;

        /* 优化:要对拿到的数据做校验,确保输入的是数字
      * / /一对斜杠里面的是正则表达式
      * ^表示开头 $表示结尾 +表示至少出现一次 \d表示数字
      * */
        if (!/^\d+$/.test(a)){
            alert('请输入数字！');
            return;
        }
        //获取结果的span标签
        let spanE=document.querySelector('span');
        //每次一次，次数加1
        count++;
        if (a>num){
            spanE.innerHTML='猜大啦！';
        }else if (a<num){
            spanE.innerHTML='猜小啦！';
        }else{
            spanE.innerHTML='恭喜你，用了'+count+'次就猜对啦！';
        }
    }


</script>
</body>
</html>